<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page contentType="text/html; charset=UTF-8" language="java"%>
<%@ taglib uri="http://struts.apache.org/tags-html"  prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-bean"  prefix="bean"%>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>
<%@page import="com.kcs.common.utils.commonUtils"%>
<%@page import="com.kcs.common.utils.PropsUtils"%>
<%@page import="com.kcs.common.utils.Constant"%>

<html>
<head>
<title>FX Margin - Check FX Margin Limit&Order</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script type="text/javascript" src="jsp/script/jquery/plugin/fancybox/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="jsp/script/jquery/plugin/fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="jsp/script/jquery/plugin/fancybox/jquery.fancybox-1.3.4.pack.js"></script>   
<script type="text/javascript" src="jsp/script/jsDatePick.full.1.3.js"></script>   	 	 	
<script type="text/javascript" src="jsp/script/common.js"></script>  
<link rel="stylesheet" type="text/css" href="jsp/script/jquery/plugin/fancybox/jquery.fancybox-1.3.4.css"/>
<link rel="stylesheet" type="text/css" href="jsp/css/table.css"/>
<link rel="stylesheet" type="text/css" href="jsp/css/fxmarginStyle.css"/>
<link rel="stylesheet" type="text/css" href="jsp/css/jsDatePick_ltr.css" />

<script type="text/javascript">
	function checkLimit(){
		var tranCode = document.getElementsByName("tranCode")[0];
		var btnCheckLimit = document.getElementsByName("btnCheckLimit")[0];
		
		tranCode.value = "checkLimit";

		updateInAmountFwCtValue();
		
		document.forms[0].submit();

		btnCheckLimit.disabled = true;
		loading();
	}

	// for popup customer //
	
	function onPopup(id, src, width, height){
		g_datacustomer = null;
		jQuery("#" + id + "_iframe").html("");
		src = "http://" + window.location.host + "/FxMargin/" + src + ".do?pAction=init";
		var html = "<center><iframe src='" + src +"' height='" + height +"px' width='" + width + "px' id='myIframe'></iframe></center>";

		jQuery("#" + id + "_iframe").html(html);

		openPopup(id);
		
	}

	function select(data){
		g_datacustomer = data;
	}
	
	function onCustomer(){
		/*	global variable 'g_datacustomer' is use	*/
 		if(g_datacustomer != null){
 			jQuery("#inCifNo").val(g_datacustomer.cifNo);
 			jQuery("#inCustomerName").val(g_datacustomer.marginAccName);	
 			jQuery("#custInfoId").val(g_datacustomer.id);	
 			//jQuery.fancybox.close();
 			resetResult();
 	 	}
		
	}
	
	function offCustomer(){
		jQuery.fancybox.close();
	}

	// for popup customer //
	function resetResult(){
		var tranCode = document.getElementsByName("tranCode")[0];
		tranCode.value = "resetResult";
	
		document.forms[0].submit();
	}

	function setOverColor(){
		var custOver = document.getElementsByName("custOverLimit")[0];
		var fxOver = document.getElementsByName("fxOverLimit")[0];

		var d = custOver.value.replace(/,/g,"");
		if(d < 0){
			custOver.style.color="red";
		}else{
			custOver.style.color="blue";
		}

		d = fxOver.value.replace(/,/g,"");	
		if(d < 0){
			fxOver.style.color="red";
		}else{
			fxOver.style.color="blue";
		}
	}

	function setInAmountFwCtFormat(){
		var tfInAmountFwCt = document.getElementById("tfInAmountFwCt");
		var inAmountFwCt = document.getElementById("inAmountFwCt");

		//tfInAmountFwCt.value = inAmountFwCt.value;
		tfInAmountFwCt.value = addCommas(CurrencyFormatted(inAmountFwCt.value));
	}

	function updateInAmountFwCtValue(){
		var tfInAmountFwCt = document.getElementById("tfInAmountFwCt");
		var inAmountFwCt = document.getElementById("inAmountFwCt");

		inAmountFwCt.value = tfInAmountFwCt.value.replace(/,/g,"");
	}

	function CurrencyFormatted(amount)
	{
		var i = parseFloat(amount);
		if(isNaN(i)) { i = 0.00; }
		var minus = '';
		if(i < 0) { minus = '-'; }
		i = Math.abs(i);
		i = parseInt((i + .005) * 100);
		i = i / 100;
		s = new String(i);
		if(s.indexOf('.') < 0) { s += '.00'; }
		if(s.indexOf('.') == (s.length - 2)) { s += '0'; }
		s = minus + s;
		return s;
	}

	function addCommas(nStr)
	{
	    nStr += '';
	    x = nStr.split('.');
	    x1 = x[0];
	    x2 = x.length > 1 ? '.' + x[1] : '';
	    var rgx = /(\d+)(\d{3})/;
	    while (rgx.test(x1)) {
	        x1 = x1.replace(rgx, '$1' + ',' + '$2');
	    }
	    return x1 + x2;
	}
	
	window.onload = function(){
		setOverColor();
		setInAmountFwCtFormat();
	}
	// for popup customer //
</script>
	
</head>
<body>
	<!-- HEADER MENU -->
	<%@ include	file="include/headerMenu.jsp"%> 
	
	<center>
		<div id="divCheckLimitOrder" style="width:95%">
			<html:form action="/CheckLimitOrderAction.do" style="margin:0px;">
				
				<html:hidden property="tranCode"/>
				<html:hidden property="custInfoId" styleId="custInfoId"/>
				
				<table class="MarginHeader" width="100%">
					<tr>
						<td>
							Check FX Margin Limit&Order
						</td>
					</tr>
				</table>
				<table height="100%" width="100%" border="0">
					<tr>
						<td>
							<table class="MarginCriteria" width="100%" height="100%">
								<tr>
									<td width="30%" align="right" valign="bottom"><font color="red">* </font>CIF No.</td>
									<td width="12%" align="left" valign="bottom">
										<html:text styleId="inCifNo" property="inCifNo" readonly="true" style="background: #DDDDDD;" onkeydown="javascript: return false;"></html:text>
									</td>
									<td width="10%" align="right" valign="bottom">Customer Name</td>
									<td width="48%" align="left" valign="bottom">
										<html:text styleId="inCustomerName" property="inCustomerName" size="50" readonly="true" style="background: #DDDDDD;" onkeydown="javascript: return false;"></html:text>
										&nbsp;&nbsp;
										<img src="jsp/images/btn/glass_search.gif" style="width:30px;cursor:pointer;" onclick="onPopup('popupCustomer','PopupCustomerAction',700,540);" />
									</td>
								<tr>
									<td align="right">Amount of Forward Contract (THB)</td>
									<td colspan="3" align="left">
										<input type="text" id="tfInAmountFwCt" style="text-align:right;" onBlur="updateInAmountFwCtValue();setInAmountFwCtFormat();"/>
										<html:hidden styleId="inAmountFwCt" property="inAmountFwCt"/>
									</td>
								</tr>
								<tr>
									<td colspan="4" align="center">
										<input type="button" class="button" name="btnCheckLimit" value="Check Limit" onclick="checkLimit();"/>
									</td>
								</tr>
							</table>
						</td>
					</tr>
					
					<!-- Pre Order -->
					<tr>
						<td>
							<br/>
							<table width="100%" height="100%" class="tableLimit">
								<tr>
									<td width="20%" align="left">
										Pre-Order Amount (THB)
									</td>
									<td width="80%" align="left">
										<table width="100%" height="100%" class="tableSubLimit">
											<tr>
												<td width="100%" class="limitAvailable" align="left">
													<html:text property="preOrderAmount" size="25" readonly="true" style="text-align:right;background: #DDDDDD;" onkeydown="javascript: return false;"/>
												</td>
											</tr>
										</table>
									</td>
								</tr>
							</table>
						</td>
					</tr>
					
					<!-- Customer Limit -->
					<tr>
						<td>
							<br/>
							<table width="100%" height="100%" class="tableLimit">
								<tr>
									<td width="20%" align="left">
										Customer Limit
									</td>
									<td width="80%" align="left">
										<table width="100%" height="100%" class="tableSubLimit">
											<tr>
												<td width="25%" align="left" class="limitAvailable">
													Limit Available (THB)
												</td>
												<td width="75%" align="left" class="limitAvailable">
													<html:text property="custLimitAvailable" size="50" readonly="true" style="text-align:right;background: #DDDDDD;" onkeydown="javascript: return false;"/>
												</td>
											</tr>
											<tr>
												<td align="left" class="overLimit">
													Over Limit (THB)
												</td>
												<td align="left" class="overLimit">
													<html:text property="custOverLimit" size="50" readonly="true" style="text-align:right;background: #DDDDDD;" onkeydown="javascript: return false;"/>
													<!-- &nbsp;
													<logic:present name="<%=Constant.OVER_LIMIT_CUST_ATTR%>">
														<font color="red"><%=request.getAttribute("OVER_LIMIT_CUST_ATTR")%></font>
													</logic:present>  
													-->
												</td>
											</tr>
										</table>
									</td>
								</tr>
							</table>
						</td>
					</tr>
					
					<!-- FX Margin Limit -->
					<tr>
						<td>
							<br/>
							<table width="100%" height="100%" class="tableLimit">
								<tr>
									<td width="20%" align="left">
										FX Margin Limit
									</td>
									<td width="80%" align="left">
										<table width="100%" height="100%" class="tableSubLimit">
											<tr>
												<td width="25%" align="left" class="limitAvailable">
													Limit Available (THB)
												</td>
												<td width="75%" align="left" class="limitAvailable">
													<html:text property="fxLimitAvailable" size="50" readonly="true" style="text-align:right;background: #DDDDDD;" onkeydown="javascript: return false;"/>
												</td>
											</tr>
											<tr>
												<td align="left" class="overLimit">
													Over Limit (THB)
												</td>
												<td align="left" class="overLimit">
													<html:text property="fxOverLimit" size="50" readonly="true" style="text-align:right;background: #DDDDDD;" onkeydown="javascript: return false;"/>				
												</td>
											</tr>
										</table>
									</td>
								</tr>
							</table>
						</td>
					</tr>
					<tr>
						<td>
							<br><br/>
							<center>
								
								<logic:present name="<%=Constant.OVER_LIMIT_FX_ATTR%>">
									<font color="red"><%=request.getAttribute("OVER_LIMIT_FX_ATTR")%></font>
								</logic:present>
								
								<%
									Object err = request.getAttribute(Constant.ERR_ATTR);
									Object comp = request.getAttribute(Constant.COMPLETE_ATTR);
								
									if(err != null){
										%>
											<script type="text/javascript">
												alert("<%=err%>");
											</script>
										<%
									
									}else{
										if(comp != null){
											%>
											<script type="text/javascript">
												alert("<%=comp%>");
											</script>
										<%
										}
									}
								%>	
							</center>
						</td>
					</tr>
				</table>
				
				<div style="display:none">
			        <div id="popupCustomer" style="width:710px;height: 600px">
			        	<div id="popupCustomer_iframe"></div>
						<table width="100%">
							<tr>
								<td width="33%" align="center">
									<input type="button" value="Ok" class="button" onclick="onCustomer();"/>
								</td>
								<td width="34%" align="center">
									<input type="button" value="Close" class="button" onclick="offCustomer();"/>
								</td>
							</tr>
						</table>
			        </div>
			    </div>
			    
				<%@ include	file="include/footer.jsp"%> 
			</html:form>
		</div>
	</center>
</body>
</html>